<template>
	<view>
		<xxm-childe @add="onAdd" @change="onChange"></xxm-childe>
		<view class="box" :style="{background:color,fontSize:size+'px'}">num:{{num}}</view>
	</view>
</template>

<script setup>
import {ref} from "vue"
const num = ref(0)
const color = ref("#fff")
const size = ref(12)


const onAdd = function(e){
	console.log(e);
	num.value = e
	// 把随机数转成String
	// substring(3,6):从第三位开始截取,截取六位
	color.value = "#"+String(e).substring(3,6)
}

const onChange = function(e){
	console.log(e);
	size.value = e
}

</script>

<style lang="scss" scoped>
.box{
	width: 200px;
	height: 200px;
}
</style>
